<template>
    <div>
        <!-- casestuid casestuname casestuage casestusex  casestusdept casediagnosis casebookdate -->
        <el-form ref="form2" :model="addForm" label-width="80px" :rules= "rules">
            <el-form-item label="学号:" style="width: 400px"  prop= "casestuid">
                <el-input placeholder="请输入学号" v-model="addForm.casestuid"></el-input>
            </el-form-item>
            <el-form-item label="姓名:" style="width: 400px" prop= "casestuname">
                <el-input placeholder="请输入姓名" v-model="addForm.casestuname"></el-input>
            </el-form-item>
            <el-form-item label="系别:" style="width: 400px" prop="casestusdept">
                <el-input placeholder="请输入系别" v-model="addForm.casestusdept"></el-input>
            </el-form-item>
            <el-form-item label="性别:" prop= "casestusex">
                <el-select  placeholder="请选择性别" v-model="addForm.casestusex">
                    <el-option label="男" value="male"></el-option>
                    <el-option label="女" value="female"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="年龄:" style="width: 200px" prop= "casestuage">
                <el-input placeholder="请输入年龄" v-model="addForm.casestuage"></el-input>
            </el-form-item>
            <el-form-item label="日期" prop= "casebookdate">
                <el-col :span="11">
                    <el-date-picker type="date" placeholder="选择日期"  style="width: 200px;" v-model="addForm.casebookdate"></el-date-picker>
                </el-col>
            </el-form-item>
            <el-form-item label="诊断" prop="casediagnosis">
                <el-input type="textarea" style="width: 400px" v-model="addForm.casediagnosis"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="dialogVisible2 = true">立即创建</el-button>
                <el-button @click="resetForm('form2')">取消</el-button>
            </el-form-item>
        </el-form>
        <el-dialog
            title="提示"
            :visible.sync="dialogVisible2"
            width="30%"
            :before-close="handleClose">
            <span>确定添加此信息</span>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible2 = false">取 消</el-button>
                <el-button type="primary" @click="addCaseBook">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script>
export default {
    name:'BingliAdd',
    data() {
        return{
            form2:{
                date2: '',
                sex2: '',
                no2: '',
                name2: '',
                dept2: '',
                age2: '',
                diagnosis: ''
            },
            dialogVisible2: false,
            rules: {
                no2:[
                    {required: true, message: '请输入学号', trigger: 'blur'}
                ],
                name2: [
                    {required: true, message: '请输入姓名', trigger: 'blur'}
                ],
                dept2: [
                    {required: true, message: '请输入系别', trigger: 'blur'}
                ],
                sex2: [
                    {required: true, message: '请选择性别', trigger: 'blur'}
                ],
                age2: [
                    { required: true, message: '年龄不能为空'},
                    { type: 'number', message: '年龄必须为数字值'},
                    { pattern: /^(0|[1-9]\d?|100)$/, message: '范围在0-100',trigger: 'blur'}
                ],
                diagnosis: [
                    { required: true, message: '请填写诊断', trigger: 'blur' }
                ]

            },
            addForm: {
                casestuid: '',
                casestuname: '',
                casestuage: '',
                casestusex: '',
                casestusdept: '',
                casediagnosis: '',
                casebookdate: '',
            }
        };
    },
    methods: {
      handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {});
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      },
      async addCaseBook () {  
        console.log(this.addForm)   
        // 添加网络校验请求
        const { data: res } = await this.$http.post('/system/apis/casebook', this.addForm)
        console.log(res.code)
        if (res.code === 30002) return this.$message.error('该病人已经存在')
        if (res.code !== 20000) return this.$message.error('添加失败')
        this.$message.success('添加成功')
        this.dialogVisible2 = false
            // 从新获取用户列表
      } 
    }   
}
</script>

<style>

</style>